@import "../base/fn";
.baodian {
    @pup-color: #9329fa;
    .gradient(#2c2cd6, #9629fc);
    color: #fff;
    .setTapColor();
    .head{
        img{display: block;}
    }
	.share_friend{
		display: flex;
		justify-content: center;
		p{
			width: 7.12rem;
			height: 1.9rem;
			line-height: 1.9rem;
			text-align: center;
			font-size: 1rem;
			color: #8927ca;
			background: #ffd600;
			border-radius: .5rem;
			display: flex;
			align-items: center;
			justify-content: center;
			span{
				display: block;
				width: .5rem;
				height: .5rem;
				border-top: 1px solid #7c18d2;
				border-right: 1px solid #7c18d2;
				transform: rotate(45deg);
			}
		}
	}
	.share_rules{
		padding: 0 1rem;
		margin: 1rem 0 3rem 0;
		p{
			font-size: .7rem;
			color: #fff;
		}
	}
	.shareToast{
		display: none;
		.mask{
			position: fixed;
			top: 0;
			bottom: 0;
			left:0;
			right: 0;
			background: rgba(0,0,0,.8);
			z-index: 9999;
		}
		.share{
			width: 100%;
			position: fixed;
			top: 40%;
			left: 50%;
			transform: translate(-50%,-50%);
			z-index: 10000;
			img{
				width: 100%;
			}
			.shareBtn{
				width: 50%;
				height: 2.4rem;
				line-height: 2.4rem;
				font-size: 1.2rem;
				text-align: center;
				color: #fff;
				background: #ec2121;
				border-radius: .4rem;
				margin: 2rem auto;
			}
		}
	}
    .subhead{
        padding: 0px 14px;
    }
    .number_panel {
        .title {
            color: @pup-color;
            padding-top: 12px;
            font-weight: 700;
            padding-bottom: 10px;
            font-size: 1.2rem;
        }
        .empty {
            height: 50px;
        }
        .btn {
            font-size: .8rem;
            background: @pup-color;
            padding: 8px 26px;
            border-radius: 20px;
            line-height: 1;
            &:before {
                border-color: #fff;
                right: 12px;
            }
        }
    }
    .summary {
        background: #fff;
        padding: 16px 0 15px;
        .title {
            font-weight: 700;
            color: @pup-color;
            padding: 10px;
        }
        .content {
            border: 2px solid @pup-color;
            margin: 0 10px;
            .desc {
                font-size: .75rem;
                padding: 8px;
                text-align: left;
            }
            .pics{
                img{
                    display: block;
                }
            }
        }
        .weui-navbar {
            height: 50px;
            &.fix {
                position: fixed;
            }
        }
        .swiper-wrapper {
            padding-top: 60px;
            padding-bottom: 90px;
        }
        .weui-navbar__item {
            &.weui-bar__item_on {
                color: @pup-color;
                border-bottom: 2px solid @pup-color;
            }
        }
    }
    .daili {
        position: fixed;
        left: 0;
        top: 120%;
        z-index: 100;
        transition: top .5s;
        .content {
            background: #fff;
            padding-top: 16px;
            text-align: center;
            .btn {
                position: absolute;
                bottom: 7px;
                left: 0;
                padding: 10px 0;
                width: 100%;
                background: 0 0;
                text-indent: -99em;
                z-index: 6;
            }
        }
        .canyu{
            padding: 0 10px;
            display: block;
        }
        .buttons {
            position: absolute;
            top: 8px;
            color: #8e29f9;
            text-align: center;
            width: 100%;
            font-size: .75rem;
            padding-top: 15px;
            padding-bottom: 10px;
            .back {
                display: none;
            }
            &:before {
                content: " ";
                .setArrow(down,10px,@pup-color,2px);
                top: -3px;
                position: absolute;
                top: 0;
                left: 50%;
                margin-left: -5px;
            }
        }
        &.fix {
            top: 83%;
        }
        &.open {
            .buttons {
                .click {
                    display: none;
                }
                .back {
                    display: block;
                }
                &:before {
                    .setArrow(top,10px,@pup-color,2px);
                    top: 5px;
                }
            }
        }
    }
}